<!--
 * @Description: 
 * @Author: dh
 * @Date: 2021-09-02 08:57:28
 * @LastEditors: dh
 * @LastEditTime: 2021-12-16 14:43:04
-->
<!doctype html>
<html lang="en">
	<head>
		<meta charset="UTF-8" />
		<meta http-equiv="X-UA-Compatible" content="IE=edge" />
		<meta name="viewport" content="width=device-width, initial-scale=1.0" />
		<title>justify</title>
	</head>

	<body>
		<style>
			div.justify {
				/* 文字向两侧对齐，对最后一行无效。 */
				text-align: justify;
				width: 200px;
				font-size: 15px;
				color: red;
				border: 1px solid blue;
			}

			div.justify > span {
				display: inline-block;
				padding-left: 100%;
			}

			.example {
				text-align: justify;
				border: solid;
			}
		</style>
		<!-- 默认使用方式 -->
		<p class="example">
			Integer elementum massa at nulla placerat varius. Suspendisse in libero risus, in interdum massa. Vestibulum ac leo vitae metus faucibus gravida
			ac in neque. Nullam est eros, suscipit sed dictum quis, accumsan a ligula.
		</p>

		<!-- https://www.cnblogs.com/lzkwin/archive/2012/11/08/2761667.html -->
		<!-- 奇淫技巧 -->
		<div class="justify">hello, text justify. justify justify justify</div>
		<br />
		<div class="justify">hello, text justify.<span></span></div>
		<br />
		<div class="justify">中 文 两 端 对 齐</div>
		<br />
		<div class="justify">中 文 两 端 对 齐<span></span></div>
	</body>
</html>
